<template>
	<div class="vab-ad" v-if="adList.length > 0">
		<el-carousel v-if="adList.length > 0" height="30px" direction="vertical" :autoplay="true" :interval="3000"
			indicator-position="none">
			<el-carousel-item v-for="(item, index) in adList" :key="index">
				<el-tag type="warning">Ad</el-tag>
				<a target="_blank" :href="item.url">{{ item.title }}</a>
			</el-carousel-item>
		</el-carousel>
	</div>
</template>
<script>
	export default {
		name: "VabAd",
		data() {
			return {
				adList: [],
			};
		},
		created() {},
		methods: {
			async fetchData() {
				var data = [];
				this.adList = data;
			},
		},
	};
</script>
<style lang="scss" scoped>
	@import "@/css/variables.scss";

	.vab-ad {
		height: 30px;
		padding-right: $base-padding;
		padding-left: $base-padding;
		margin-bottom: -20px;
		line-height: 30px;
		cursor: pointer;

		a {
			color: #999;
		}
	}
</style>
